import QtQuick 2.0
import QtQuick.Controls 1.1
import "../FKWidget/"

FKWidget{
    id: userWidget
    relativeHeight: 0.6
    relativeWidth: 0.3

    signal createUser(var userName)
    signal deleteUser(var userName)
    signal addUser(var userName)
    signal removeUser(var userName)
    signal apply
    signal cancel

    FKViewport{
        Component{
            id: userDelegate
            Item{
                property var view: ListView.view
                property string user: display
               // color: ListView.isCurrentItem ? "blue" : "white"
                width: t.width
                height: t.height
                Text{
                    id:t
                    width: parent.view.width
                    text: display
                    anchors.centerIn: parent
                    font.pointSize: 11
                    horizontalAlignment: Text.AlignHCenter
                }
                MouseArea{
                    anchors.fill: parent
                    onClicked: parent.view.currentIndex=index
                }
            }
        }
        Item{
            id: viewport
            anchors.centerIn: parent
            width: parent.width*0.9
            height: parent.height*0.9
            //focus: true
            Text{
                id: tlbl
                text: qsTr("New user:")
                anchors.left: parent.left
                anchors.top: parent.top
            }
            TextField{
                id: newUser
                anchors.right: parent.right
                anchors.top: parent.top
                anchors.left: tlbl.right
              //  focus: true
            }
            Rectangle{
                id: lists
                color: "lightgrey"
                anchors.topMargin: 10
                anchors.bottomMargin: 10
                anchors.top: newUser.bottom
                anchors.left: parent.left
                anchors.right: parent.right
                //height: parent.height*0.45
                anchors.bottom: buttons.top
                Rectangle{
                    anchors.top: parent.top
                    anchors.left: parent.left
                    anchors.bottom: parent.bottom
                    width: parent.width*0.5
                    border.color: "black"
                    border.width: 2
                    ListView{
                        id: avaliable
                        anchors.fill: parent
                        delegate: userDelegate
                        model: avaliableUsersModel
                        highlight: Rectangle{color: "blue"}
                        header: FKLabel{
                            color: "lightgrey"
                            text.text: qsTr("Avaliable users")
                            text.width: avaliable.width
                            font{italic: true; pointSize: 12}
                            text.horizontalAlignment: Text.AlignHCenter
                            border.color: "black"
                            border.width: 2
                        }
                    }
                }
                Rectangle{
                    anchors.top: parent.top
                    anchors.right: parent.right
                    anchors.bottom: parent.bottom
                    width: parent.width*0.5
                    border.color: "black"
                    border.width: 2
                  //  clip: true
                    ListView{
                        id: current
                        anchors.fill: parent
                        delegate: userDelegate
                        model: currentUsersModel
                        highlight: Rectangle{color: "red"}
                        header: FKLabel{
                            color: "lightgrey"
                            text.text: qsTr("Selected users")
                            text.width: current.width
                            font.italic: true
                            font.pointSize: 12
                            border.color: "black"
                            border.width: 2
                            text.horizontalAlignment: Text.AlignHCenter
                        }
                    }
                }
            }
            Column{
                id: buttons
                anchors.topMargin: 10
                //anchors.top: lists.bottom
                anchors.bottom: parent.bottom
                Button{
                    text: qsTr("Create user")
                    width: viewport.width
                    onClicked: userWidget.createUser(newUser.text)
                }
                Button{
                    text: qsTr("Delete user")
                    width: viewport.width
                    onClicked: if(avaliable.currentIndex !== -1)userWidget.deleteUser(avaliable.currentItem.user)
                }
                Button{
                    text: qsTr("Add user")
                    width: viewport.width
                    onClicked: if(avaliable.currentIndex !== -1)userWidget.addUser(avaliable.currentItem.user)
                }
                Button{
                    text: qsTr("Remove user")
                    width: viewport.width
                    onClicked: if(current.currentIndex !== -1)userWidget.removeUser(current.currentItem.user)
                }
                Button{
                    text: qsTr("Continue")
                    width: viewport.width
                    onClicked: userWidget.apply()
                }
                Button{
                    text: qsTr("Back")
                    width: viewport.width
                    onClicked: userWidget.cancel()
                }
            }
        }
    }
}
